<template>
    <view>
        <custom><template #backText>我的礼包</template></custom>
        <emptyList v-if="data.list.length == 0" empty_list_title="还没有购买礼包"></emptyList>
        <view v-else v-for="(info, key) in data.list" :key="key" class="margin-20 bg-white padding-20 radius-16">
            <view class="flex justify-between width-100p text-13 line-height-11em margin-bottom-10">
                <view class="text-gray flex-s0 margin-right-10">
                    <text class="cu-btn sm margin-right-10" :class="info.gift_type == '1' ? 'bg-deep-nddyny' : (info.gift_type == '0' ? 'bg-nddyny' : '')">
                        {{info.gift_type == '1' ? '城市合伙人' : (info.gift_type == '0' ? '推广专员' : '')}}
                    </text>
                    <text v-if="info.pay_callback_time> 0">
                        {{info.pay_callback_time | dateFormat('yyyy-MM-dd hh:mm:ss')}}
                    </text>
                </view>
                <view>
                    <text class="text-gray margin-right-10 text-sm text-nddyny">({{info.pay_type_string}})</text>
                    <text v-if="info.pay_status == 1" class="text-nddyny text-bold text-15">
                        支付成功
                    </text>
                    <text v-else-if="info.pay_status == 2" class="text-red text-bold text-15">
                        支付出错了
                    </text>
                </view>
            </view>
            <view v-if="info.pay_remark" class="text-red text-bold line-height-11em margin-bottom-10">
                {{info.pay_remark}}
            </view>
            <view class="flex">
                <view>
                    <image style="width: 150rpx; height: 150rpx;" :src="info.gift_logo | ossUrl(150)"></image>
                </view>
                <view class="margin-left-10 width-100p">
                    <view class="text-sm text-gray">
                        {{info.pay_order_no}}
                    </view>
                    <view class="text-cut-2 text-bold text-15">
                        {{info.gift_name}}
                    </view>
                    <view class="text-666 text-13">
                        {{info.gift_content}}
                    </view>
                    <view v-if="info.gift_attr" class="text-gray text-13">
                        {{info.gift_attr}}
                    </view>
                    <view class="text-right">
                        <view class="text-nddyny text-sm" v-if="info.reward_amount > 0">
                            <text class="text-bold">推荐人</text>奖励
                            <text class="margin-left-10">
                                推广额度 {{info.reward_amount | floor}}
                            </text>
                        </view>
                        <view class="text-nddyny text-sm" v-if="info.reward_gold_share_amount > 0">
                            <text class="text-bold">购买人</text>奖励
                            <text class="margin-left-10">
                                金股数量 {{info.reward_gold_share_amount | floor}}
                            </text>
                        </view>
                        <view>
                            <text class="text-red text-bold">
                                实付款<text class="text-sm margin-left-4">￥</text>{{info.pay_order_price | floor}}
                            </text>
                        </view>
                    </view>
                </view>
            </view>
            <view>
                <view>
                    <view>
                        <text class="text-bold" v-if="info.recv_send_status != 1">未发货</text>
                        <text class="text-nddyny text-bold" v-else>已发货</text>
                        <text class="margin-left-20">{{info.recv_name}}</text>
                        <text class="margin-left-20 text-gray">{{info.recv_phone}}</text>
                    </view>
                    <view class="text-gray">
                        {{info.recv_province_city_area_name}}
                        {{info.recv_address_remark}}
                    </view>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                data: {
                    offset: 0,
                    limit: 15,
                    stop: false,
                    list: [],
                },
            }
        },
        onLoad(params) {
            this.getList(this.$api.list_action_page_init);
        },
        onReachBottom() {
            this.getList(this.$api.list_action_add);
        },
        methods: {
            getList(action) {
                this.$api.list(this, {
                    action,
                    url: '/userPay/PromoterGift/list',
                    success: (Result) => {
                        if (this.$api.form.toast(this, Result)) return;
                        Result.result.list.forEach(info => {
                            info.pay_type_string = this.$dict.pay_type[info.pay_type];
                        })
                        this.data.list = this.data.list.concat(Result.result.list);
                    }
                });
            },
        }
    }
</script>
